<template>
  <div>
    <div>this is a test</div>
    <div>index: {{ dsInState.currentIndex }}</div>
    <div>key: {{ dsInState.currentKey }}</div>
    <div>size: {{ dsInState.size() }}</div>
    <div :style="{ height: '10px' }"></div>
    <div>{{ dsInState.getFieldsValue() }}</div>
    <div>current record: {{ currentRecord.getFieldsValue() }}</div>
    <div>{{ currentValue }}</div>
    <pre>{{
      JSON.stringify(
        dsInState.getValues({ status: 'all', withKey: true, withStatus: true }),
        null,
        2
      )
    }}</pre>
    <button @click="doIt">Click</button>
    <button @click="goPrevious">&lt;&lt;</button>
    <button @click="goNext">&gt;&gt;</button>
    <button @click="doUpdate">update</button>
    <button @click="doAddTop">add record top</button>
    <button @click="doAddBottom">add record bottom</button>
    <button @click="doDelete">delete record</button>
  </div>
</template>

<script>
import FCDataset from '@/vendors/fc-dataset/FCDataset'

Date.prototype.format = function (fmt) {
  var o = {
    'M+': this.getMonth() + 1, //月份
    'd+': this.getDate(), //日
    'h+': this.getHours(), //小时
    'm+': this.getMinutes(), //分
    's+': this.getSeconds(), //秒
    'q+': Math.floor((this.getMonth() + 3) / 3), //季度
    S: this.getMilliseconds(), //毫秒
  }
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(
      RegExp.$1,
      (this.getFullYear() + '').substr(4 - RegExp.$1.length)
    )
  }
  for (var k in o) {
    if (new RegExp('(' + k + ')').test(fmt)) {
      fmt = fmt.replace(
        RegExp.$1,
        RegExp.$1.length == 1 ? o[k] : ('00' + o[k]).substr(('' + o[k]).length)
      )
    }
  }
  return fmt
}

// const dsInBack = new FCDataset({
//   fields: [
//     { name: 'a', type: 'number' },
//     { name: 'b', type: 'string' },
//     { name: 'd', type: 'string' },
//     { name: 'date1', type: 'date' },
//   ],
//   datas: [
//     { a: 1, b: 2, c: 3, d: 'this is a test 1', date1: new Date() },
//     { a: 11, b: 12, c: 13, d: 'this is a test 2', date1: new Date() },
//     { a: 21, b: 22, c: 23, d: 'this is a test 3', date1: new Date() },
//     { a: 21, b: 22, c: 23, d: 'this is a test 3', date1: new Date() },
//   ],
// })

// console.log('> dsInBack is:', dsInBack.getFieldsValue())

// const date_1 = dsInBack.getFieldValue('date1')
// console.log('> date_1 is:', date_1)

// const date_2 = dsInBack.getFieldValue('date1')
// console.log('> date_2 is:', date_2)

// console.log(
//   '> dsInback date is:',
//   dsInBack.getFieldValue('date1').format('yyyy-MM-dd')
// )

// const d3 = new Date()
// console.log('d3 is:', d3.format("yyyy-MM-dd"))

export default {
  name: 'pageA',

  data() {
    const dsInState = new FCDataset({
      fields: [
        { name: 'a', type: 'number' },
        { name: 'b', type: 'string' },
        { name: 'd', type: 'string' },
        { name: 'date1', type: 'date' },
      ],
      datas: [
        { a: 1, b: 2, c: 3, d: 'this is a test 1', date1: new Date() },
        { a: 11, b: 12, c: 13, d: 'this is a test 2', date1: new Date() },
        // { a: 21, b: 22, c: 23, d: 'this is a test 3', date1: new Date() },
        { a: 21, b: 22, c: 23, d: 'this is a test 3', date1: new Date() },
      ],
    })

    const currentRecord = dsInState.getCurrentRecord()
    const currentValue = dsInState.getFieldsValue()

    return {
      dsInState,
      currentRecord,
      currentValue,
    }
  },

  methods: {
    doIt() {
      console.log(
        '>>',
        this.dsInState.getFieldValue('date1').format('yyyy-MM-dd')
      )
    },
    goPrevious() {
      this.dsInState.goPrevious()
    },
    goNext() {
      this.dsInState.goNext()
    },
    doUpdate() {
      console.log('record index:', this.dsInState.currentIndex)
      this.dsInState.setFieldsValue({
        a: 23,
        date1: new Date(),
      })
    },
    doAddTop() {
      console.log('now add record')
      this.dsInState.addRecord({
        data: { a: 1111, b: 2222, date1: new Date() },
        direction: 'top',
        // updateKey: true,
      })
    },
    doAddBottom() {
      console.log('now add record')
      this.dsInState.addRecord({
        data: { a: 1111, b: 2222, date1: new Date() },
        direction: 'bottom',
        // updateKey: true,
      })
    },
    doDelete() {
      this.dsInState.deleteRecord()
    },
  },

  mounted() {
    console.log('now do it...')
  },
}
</script>

<style lang="less" scoped></style>
